<template>
  <div class="registerbox">
    <!-- <system-information></system-information>  -->
    <div class="imglogobox">
        <img src="../assets/images/logo.png" alt="logo">
    </div>
    <el-form >
        <el-form-item >
            <el-input prefix-icon="el-icon-user"  v-model="username" name="name" placeholder="请输入用户名"  clearable></el-input>
        </el-form-item>
        <el-form-item >
            <el-input prefix-icon="el-icon-message"  v-model="email" name="email" placeholder="请输入邮箱"  clearable></el-input>
        </el-form-item>
        <el-form-item >
            <el-input prefix-icon="el-icon-lock"  v-model="password" name="password" placeholder="请输入密码" show-password ></el-input>
        </el-form-item>
        <el-form-item>
            <el-button type="primary"  @click="submitLogin">注册</el-button>
        </el-form-item>
    </el-form>
  </div>
</template>

<script>
//   import SystemInformation from '../components/LandingPage/SystemInformation'
import API from '../api/api'
  import {commonMixin} from '../config/mixin'
  export default {
    name: 'register',
    mixins: [commonMixin],
    data(){
        return {
            username:'', //用户名
            password:'', //密码
            email:''
        }
    },
    // components: { SystemInformation },
    methods: {
        async usersRegest(username,password,email){
            let result = await API.usersRegest({
                username,
                password,
                email,
            })
            if(result.status==200){
                this.$message({
                    type:'success',
                    message:'注册成功'
                })
                
                this.$router.push({
                    name:'登录'
                })
            }
        },
        submitLogin(){
            if(!this.username){
                this.$message({
                    type:'warning',
                    message:'请输入用户名'
                })
                return
            }
            if(!this.password){
                this.$message({
                    type:'warning',
                    message:'请输入密码'
                })
            }
            if(!this.email){
                this.$message({
                    type:'warning',
                    message:'请输入邮箱'
                })
            }   
            this.usersRegest(this.username,this.password,this.email);
            // this.$router.push({
            //     name:'登录'
            // })
        },
        topage(){
            this.$router.push({
                name:'landing-page'
            })
        }
    }
  }
</script>

<style lang='scss' scoped>
    .registerbox {
        padding: 0 50px;
        .imglogobox {
            text-align: center;
            img {
                width: 110px;
                height: auto;
            }
        }
        .el-button--primary {
            width: 100%;
        }
    }
</style>
